<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>WebEx</title>
    <link rel="icon" type="image/x-icon" href="img/logo.png" />
    <link rel="stylesheet" href="bootstrap-3.3.7-dist/bootstrap-3.3.7-dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="css/details.css">
    <style>
        .details{
            z-index: 9999;
            background: #fff;
        }
        textarea{
            overflow-y: hidden;
            overflow-x: hidden;
            outline: none;
            resize:none;
            opacity: 0;
        }
    </style>
</head>
<body>
    <div class="details">
        <div class="content">
            <!--title-->
            <div class="title">
                <input type="text" readonly="readonly" value="KTM的直播会议">
            </div>
            <!--开始时间-->
            <div class="time">
                <span>开始时间:</span>
                <input id="time" class="time" type="text" readonly="readonly" value="2018-12-05 11:25:00">
            </div>
            <!--会议号-->
            <div class="huiyi">
                <span>会议号:</span>
                <input id="huiyi" type="text" readonly="readonly" value="184974259">
            </div>
            <!--会议密码-->
            <div class="pwd">
                <span>会议密码:</span>
                <input id="pwd" type="text" readonly="readonly" value="6U7cpYwK">
            </div>
            <!--主持人密钥-->
            <div class="host">
                <span>主持人密钥:</span>
                <input id="key" type="text" readonly="readonly" value="114312">
            </div>
            <!--主持人连接-->
            <div class="link">
                <span>主持人链接:</span>
                <input id="host" type="text" readonly="readonly" value="https://ktyb.webex.com.cn/ktyb/j.php?ED=34726172">
                <i class="glyphicon glyphicon-link" onclick="copyText()"></i>
            </div>
            <!--加入者连接-->
            <div class="join">
                <span>加入者链接:</span>
                <input id="join" type="text" readonly="readonly" value="https://ktyb.webex.com.cn/ktyb/j.php?MTID=m82fa4cb87ad634dbab64ac29d514b43b">
                <i class="glyphicon glyphicon-link" onclick="copyText1()"></i>
            </div>
            <!--CMR地址-->
            <div class="cmr">
                <span>CMR地址:</span>
                <input id="cmr" type="text" readonly="readonly" value="60180@ketiancloud.com">
                <i class="glyphicon glyphicon-link" onclick="copyCmr()"></i>
            </div>
            <!--直播地址-->
            <div class="live">
                <span>直播地址:</span>
                <input id="live" type="text" readonly="readonly" value="http://live.ketianyun.com/watch/2173624">
                <i class="glyphicon glyphicon-link" onclick="copyLive()"></i>
            </div>
            <!--复制全部按钮-->
            <div class="copy">
                <a onclick="fz()">复制全部</a>
            </div>
        </div>

        <form>

        </form>
        <!--返回按钮-->
        <button class="back" type="submit">返回</button>
    </div>

    <!--copy 所有部分 -->
    <form id="text" style="display: none">
     <p>开始时间：2018-12-05 11:25:00</p>
     <p>会议号：184974259</p>
     <p>会议密码：6U7cpYwK</p>
     <p>主持人密钥：114312</p>
     <p>主持人链接：https://ktyb.webex.com.cn/ktyb/j.php?ED=34726172</p>
     <p>加入者链接：https://ktyb.webex.com.cn/ktyb/j.php?MTID=m82fa4cb87ad634dbab64ac29d514b43b</p>
     <p>CMR地址：60180@ketiancloud.com</p>
     <p>直播地址：http://live.ketianyun.com/watch/2173624</p>
    </form>
    <!--从表单copy到<textarea> 再把textarea去掉边框修改css样式让其不可见-->
    <textarea id="input" name="" cols="0" rows="0" style="border: none;"></textarea>

    <!--<input id="input" style="border: none; width: 0.1px;">-->

    <script src="js/jquery.min.js"></script>
    <script type="text/javascript">
        // copy 主持人连接
        function copyText() {
            var host = document.getElementById("host");
            host.select(); // 选中文本
            document.execCommand("copy"); // 执行浏览器复制命令
            alert("复制成功");
        }
        // copy 加入者连接
        function copyText1(){
            var join = document.getElementById("join");
            join.select(); // 选中文本
            document.execCommand("copy"); // 执行浏览器复制命令
            alert("复制成功");
        }
        // copy CMR链接
        function copyCmr(){
            var cmr = document.getElementById("cmr");
            cmr.select(); // 选中文本
            document.execCommand("copy"); // 执行浏览器复制命令
            alert("复制成功");
        }
        // copy 直播地址
        function copyLive(){
            var live = document.getElementById("live");
            live.select(); // 选中文本
            document.execCommand("copy"); // 执行浏览器复制命令
            alert("复制成功");
        }
        // copy 全部文本
        function fz(){
            var text = document.getElementById("text").innerText;
            var input = document.getElementById("input");
            input.value = text; // 修改文本框的内容
            input.select();
            document.execCommand("copy"); // 执行浏览器复制命令
            alert("复制全部成功");
        }
    </script>
</body>
</html>